<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>indexedDB</title>
</head>
<body>
<script>
    var db = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB ||
        window.msIndexedDB
    var request,result,version =2,
        dbname = 'testDB',
        osName = 'os1';

    //创建数据库函数
    function creatDB() {
        request = db.open(dbname,version)
        request.onsuccess = function () {
            db = request.result;
            console.log('open success')
        }
        request.onerror = function (e) {
            console.log(e.currentTarget.error.message)
        }
        //该定义函数，在改变版本后才触发
        request.onupgradeneeded = function () {
            var store = null
            db = request.result
            console.log('onupgradeneeded')
            //检查表是否已经创建
            if(!db.objectStoreNames.contains(osName)){
//                db.createObjectStore(osName,{autoIncrement:true});  //主键自增
                  store = db.createObjectStore(osName,{keyPath:'id'})  //将id作为主键

                //创建索引
                store.createIndex('idIndex','id',{unique:true});
                store.createIndex('categoryIndex','category',{multiEntry:true})
                store.createIndex('hpIndex','hp',{unique:false});

            }

        }
    }
    //执行创建数据库的函数
    creatDB()

    //save data ,JSON数据格式,存储数据
    var data = [{
        name:'baby',
        id:'001',
        hp:3,
        category:['hello','baby']
    },{
        name:'baby2',
        id:'002',
        hp:5,
        category:['hello','baby2']
    },{
        name:'baby3',
        id:'003',
        hp:9,
        category:['hello','baby3']
    }
    ];

    //添加数据
    function addData() {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName)
        data.map(function (o) {
            store.add(o)
        })
    }
    function getData(id) {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName)
        var request = store.get(id)
        request.onsuccess = function () {
            console.log(request.result)
        }
    }
    function getAlldata() {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName)
        var request = store.getAll(id)
        request.onsuccess = function () {
            console.log(request.result)
        }
    }
    function updateData(id) {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName)
        var request = store.get(id);
        request.onsuccess = function () {
            request = store.put({
                name:'小恶魔',
                id:id,
                hp:9
            });
            console.log(request.result)
        }
    }
    function deleteData(id) {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName)
        var request = store.delete(id)
        request.onsuccess = function () {
            console.log('delete success')
        }
    }
    function clear() {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName);
        var request = store.clear();
        request.onsuccess = function () {
            console.log('clear success')
        }
    }
    function useCursorGetData() {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName),
//            request = store.openCursor(IDBkeyRange.only('002')),
            //打开游标,逆序遍历
            request = store.openCursor(null,'prev');
            request.onsuccess = function () {
            //创建游标实例
            var cursor = request.result;
            if(cursor){
                console.log(cursor.value);
                cursor.continue()   //遍历对象
            }
        }
    }

    //使用索引获取数据
    function useIndexGetData() {
        var transaction = db.transaction(osName,'readwrite'),
            store = transaction.objectStore(osName),
            index = store.index('categoryIndex'),
            request = index.getAll('hello');

        request.onsuccess = function () {
            console.log(request.result)
        }
    }

    //使用索引和游标操作数据
    function useIndexAndCursorOperateData() {
        var transaction = db.transaction(osName, 'readwrite'),
            store = transaction.objectStore(osName),
            index = store.index('categoryIndex'),
            request = index.openCursor()

        request.onsuccess = function () {
            var cursor = request.result;
            if (cursor) {
                if(cursor.value.id === '002'){
//                    cursor.update({
//                        name:'babybeauty',
//                        id:'002',
//                        hp:5,
//                        category:['hello','baby2']
//                    })
                    cursor.delete().onsuccess = function () {
                        console.log('delete success')
                    }
                    
                }
                console.log(cursor.value);
                cursor.continue()   //遍历对象
            }
        }
    }

    //hp小于5的加10，大于5的加20
    function useIndexAndCursorreviseData() {
        var transaction = db.transaction(osName, 'readwrite'),
            store = transaction.objectStore(osName),
            index = store.index('hpIndex'),
//            request = index.openCursor(IDBKeyRange.upperBound(5)),
            request = index.openCursor(IDBKeyRange.Bound(5,10,true,true));

        request.onsuccess = function () {
            var cursor = request.result,
                value = null;
            if (cursor) {
                value = cursor.value;
                value.hp += 10;
                cursor.update(value);
                console.log(cursor.value);
                cursor.continue()

                }
            }
        }



</script>
</body>
</html>